﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>ACE多级菜单</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <!-- basic styles -->
    <link rel="stylesheet" href="assets/css/bootstrap.min.css"/>
    <!-- fonts -->
    <link rel="stylesheet" href="assets/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="assets/font-user-defined.css"/>
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400,300"/>
    <!-- ace styles -->
    <link rel="stylesheet" href="assets/css/ace.min.css"/>
    <link rel="stylesheet" href="assets/css/ace-rtl.min.css"/>
    <link rel="stylesheet" href="assets/css/ace-skins.min.css"/>
    <!--自定义style样式，最后加载-->
    <link rel="stylesheet" href="selfjs/indexStyle.css"/>
    <!-- basic scripts -->
    <script src="assets/js/jquery-2.0.3.min.js"></script>
    <!-- ace settings handler -->
    <script src="assets/js/ace-extra.min.js"></script>
    <!-- ace scripts -->
    <script src="assets/js/ace.min.js"></script>
</head>
<body>
<div class="main-container" id="main-container">
    <div class="main-container-inner">
        <a class="menu-toggler" id="menu-toggler" href="#">
            <span class="menu-text"></span>
        </a>
        <div class="sidebar" id="sidebar">
            <!-- #sidebar-shortcuts -->
            <ul class="nav nav-list cursor-pointer">
                <li>
                    <a class="dropdown-toggle">
                        <i class="icon-desktop"></i>
                        <span class="menu-text"> UI 组件 </span>
                        <b class="arrow icon-angle-down"></b>
                    </a>
                    <ul class="submenu">
                        <li>
                            <a>
                                <i class="icon-double-angle-right"></i> 组件
                            </a>
                        </li>
                        <li>
                            <a>
                                <i class="icon-double-angle-right"></i> 按钮 &amp; 图表
                            </a>
                        </li>
                        <li>
                            <a>
                                <i class="icon-double-angle-right"></i> jQuery UI
                            </a>
                        </li>
                        <li>
                            <a class="dropdown-toggle">
                                <i class="icon-double-angle-right"></i> 三级菜单
                                <b class="arrow icon-angle-down"></b>
                            </a>
                            <ul class="submenu">
                                <li>
                                    <a>
                                        <i class="icon-leaf"></i> 第一级
                                    </a>
                                </li>
                                <li>
                                    <a class="dropdown-toggle">
                                        <i class="icon-pencil"></i> 第四级
                                        <b class="arrow icon-angle-down"></b>
                                    </a>
                                    <ul class="submenu">
                                        <li>
                                            <a>
                                                <i class="icon-plus"></i> 添加产品
                                            </a>
                                        </li>
                                        <li>
                                            <a>
                                                <i class="icon-eye-open"></i> 查看商品
                                            </a>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </li>
            </ul>
            <!-- /.nav-list -->
            <div class="sidebar-collapse" id="sidebar-collapse">
                <i class="icon-double-angle-left" data-icon1="icon-double-angle-left"
                   data-icon2="icon-double-angle-right"></i>
            </div>
        </div>
    </div>
    <!-- /.main-container-inner -->
    <a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
        <i class="icon-double-angle-up icon-only bigger-110"></i>
    </a>
</div>
<!-- /.main-container -->
</body>
</html>